.box {
  width: 750px;
  margin: 10px auto;
  background-color: #409eff;
  color: #fff;
  padding: 20px;
  border-radius: 10px;
  font-size: 14px;
  ul {
    li {
      border-bottom: 1px solid #ffffff;
      display: flex;
      align-items: center;
      &:nth-of-type(1) {
        border-top: 1px solid #ffffff;
      }
      & > div {
        padding: 10px 0;
        flex: 1;
        border-right: 1px solid #ffffff;
        text-align: center;
      }
      .name {
        border-left: 1px solid #ffffff;
      }
      .btn-box {
        border-left: 1px solid #ffffff;
      }
      .opt {
        display: flex;
        align-items: center;
        justify-content: center;
        & > div {
          width: 20px;
          height: 20px;
          background-color: #ddd;
          border: 1px solid #ffffff;
        }
        .sub {
          &:hover {
            cursor: pointer;
            background-color: rgb(124, 123, 123);
          }
        }
        .num {
          background-color: unset;
          border-left: none;
          border-right: none;
          width: 35px;
        }
        .add {
          &:hover {
            cursor: pointer;
            background-color: rgb(124, 123, 123);
          }
        }
      }
    }
  }
}
